import React, { Component } from 'react';
import dayjs from 'dayjs';
import Cookie from 'js-cookie';
import { avater } from "@/api/user";
import './Hello.less';


class Hello extends Component {
  constructor(props) {
    super(props);
    const iseat = Cookie.get('iseat') === 'true';
    this.state = {
      eat: iseat,
      greetings: '',
      text: []
    }
  }
  getGreetings = () => {
    const hour = dayjs().hour();
    if (hour >= 6 && hour < 12) {
      if (!this.state.eat && hour >= 10) {
        return '中午吃啥'
      }
      return '早安';
    } else if(hour < 18) {
      return '午安';
    } else {
      return '晚安';
    }
  }
  setGreetings = () => {
    let greetings = this.getGreetings();
    this.setState({
      greetings
    })
  }
  isEat = () => {
    Cookie.set('iseat', 'true', { expires: 1 });
    this.setState({
      eat: true
    })
    this.setGreetings();
  }
  getNow = () => {
    const { text } = this.state;
    const week = ['一', '二', '三', '四', '五', '六', '日'];
    const d = dayjs();
    const t = d.format('YYYY-MM-DD HH:mm') + ' 周' + week[d.day()];
    text.push(t)
    this.setState({
      text
    })
  }
  
  componentDidMount() {
    this.setGreetings();
    setInterval(() => {
      this.setGreetings();
    }, 60 * 1000)
    this.getNow();
  }

  render() {

    const { greetings, text } = this.state;

    return (
      <div>
        <div className="avater-con"><img className="avater" src={avater} alt=""/></div>
        <div className="content">
          <p className="greetings">
            {greetings === '该点饭了~' ? (<a href="javascript:;" onClick={() => this.isEat()}>该点饭了~</a>) : greetings}
          </p>
          <p className="text">{text.join('，')}</p>
        </div>

      </div>
    )
  }
}

export default Hello;